import React, {useRef} from 'react'

export default function Ref() {
  //1. 使用 useRef 创建一个容器
  let input = useRef();
  let box = useRef();

  //声明 show
  let show = () => {
    //获取值
    let v = input.current.value;
    //设置值
    box.current.innerHTML = v;
  }

  return (
    <div>
      {/* 2. 为虚拟 DOM 对象添加 ref 属性 */}
      <input  type="text" ref={input} /><button onClick={show}>显示</button>
      <hr />
      <div id="result" ref={box} style={{width: '400px', height: '300px',border: 'solid 1px #666'}}>

      </div>
    </div>
  )
}
